<template>
	<view class="page" :style="{backgroundImage: `url(${details.head_img})`}">
		<view class="flex benben-position-layout flex flex-wrap align-center heIndex_flex_0"
			:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx'}">
			<view class='flex flex-wrap align-center justify-between flex-sub heIndex_fd0_0'>
				<view class='flex flex-wrap align-stretch heIndex_fd0_0_c0' @tap.stop="handleJumpDiy" data-type="back" data-url="1">
					<!-- <image class='heIndex_fd0_0_c0_c0' :src='STATIC_URL+"16.png"'></image> -->
					<u-icon name="arrow-left" color="#fff" size="34"></u-icon>
				</view>
				<view class='flex flex-wrap align-stretch justify-center flex-sub'>
				</view>
				<view class='flex  align-center justify-end heIndex_fd0_0_c2'>
					<button style="margin-right: 24rpx;" class='heIndex_fd0_0_c2_c0' @click="openBlock" v-if="is_hide == 1">拉黑</button>
					<button class='heIndex_fd0_0_c2_c0' @click="getFollow" v-if="details.is_follow == 0">关注</button>
					<button class='heIndex_fd0_0_c2_c0' @click="getFollow" v-else>已关注</button>
				</view>
			</view>
		</view>
		<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
		<view class="loading_css" v-if="isShow">
			<u-loading size="36" color="#6A0002"></u-loading>
			<view class="loading_text">加载中</view>
		</view>
		<block v-else>
			<!---flex布局flex布局开始-->
			<view class="flex flex-direction align-center benben-flex-layout heIndex_flex_1">
				<view class='flex flex-wrap align-center heIndex_fd1_0'>
					<view class="upload position-relative">

						<image class=" heIndex_fd1_0_c0_image" :src="details.head_img" mode="aspectFill"
							@click="previewImage(0, 1)"></image>
					</view>
					<view class='heIndex_fd1_0_c1'>
						<image class='heIndex_fd1_0_c1_c0' mode="aspectFill" :src='STATIC_URL+"19.png"' v-if="details.is_vip== 1"></image>
						<text class='heIndex_fd1_0_c1_c1' v-if="details.is_real_person_auth == 1">已真人认证</text>
						<text class='heIndex_fd1_0_c1_c1' v-else>未真人认证</text>
					</view>
				</view>
				<view class='flex flex-wrap align-center heIndex_fd1_1'>
					<text class='heIndex_fd1_1_c0'>{{details.user_nickname}}</text>
				</view>
				<view class='flex flex-wrap align-center justify-center heIndex_fd1_2'>
					<text class='heIndex_fd1_2_c0' v-if="details.sex == 1">男</text>
					<text class='heIndex_fd1_2_c0' v-if="details.sex == 2">女</text>
					<text class='heIndex_fd1_2_c0' v-if="details.age">{{details.age}}</text>
					<text class='heIndex_fd1_2_c0' v-if="details.height">{{details.height}}</text>
					<text class='heIndex_fd1_2_c0' v-if="details.weight">{{details.weight}}</text>
					<text class='heIndex_fd1_2_c0' v-if="details.sex == 2 && details.bust">胸围:{{details.bust}}</text>
					<text class='heIndex_fd1_2_c0' v-if="details.sex == 2 && details.waistline">腰围:{{details.waistline}}</text>
					<text class='heIndex_fd1_2_c0' v-if="details.sex == 2 && details.hipline">臀围:{{details.hipline}}</text>
				</view>
				<view class='flex flex-wrap align-center heIndex_fd1_3'>
					<view class='flex flex-wrap align-center justify-around flex-sub heIndex_fd1_3_c0'>
						<view class='flex flex-direction flex-wrap align-center justify-center'>
							<text class='heIndex_fd1_3_c0_c0_c0'>{{details.follow_nums}}</text>
							<text class='heIndex_fd1_3_c0_c0_c1'>关注</text>
						</view>
						<view class='flex flex-direction flex-wrap align-center justify-center'>
							<text class='heIndex_fd1_3_c0_c0_c0'>{{details.fans_nums}}</text>
							<text class='heIndex_fd1_3_c0_c0_c1'>粉丝</text>
						</view>
						<view class='flex flex-direction flex-wrap align-center justify-center'>
							<text class='heIndex_fd1_3_c0_c0_c0'>{{details.likes_nums}}</text>
							<text class='heIndex_fd1_3_c0_c0_c1'>点赞</text>
						</view>
					</view>
				</view>
			</view>

			<!---flex布局flex布局结束-->
			<!---flex布局flex布局开始-->
			<view class="flex flex-direction flex-wrap align-stretch benben-flex-layout heIndex_flex_2">
				<view class='flex flex-wrap align-center'>
					<view>
						<benben-flex-tabs class-name='heIndex_benbenTabsfd2_0_c0' v-model="tabs"
							ref="benben_tabsfd2_0_c0" select-mark="benben_tabsfd2_0_c0" key="benben_tabsfd2_0_c0"
							:open-title-type='false' :open-sticky='true' :top='0' :is-show-content='true'
							:scrollspy='false' :tabs-info.sync="tabsInfofd2_0_c0">

							<scroll-view @scroll="tabsInfofd2_0_c0.scrollX = $event.detail.scrollLeft"
								id="benben_tabsfd2_0_c0" class="benben-tabs" style="width:750rpx" :scroll-x="true"
								:scroll-left.sync="tabsInfofd2_0_c0.moveX" scroll-with-animation="all .3s ease">
								<view class="benben-tabs-content" id="benben_tabsfd2_0_c0-content">
									<view id="benben_tabsfd2_0_c0-title"
										class="benben-tabs-title flex flex align-center justify-around">
										<view
											:class="{ 'checkTitlefd2_0_c0': tabs == '1', 'flex flex-wrap align-center heIndex_titlefd2_0_c0_c3': true }"
											@tap="tabs = '1'" :id="`benben_tabsfd2_0_c0-title-item-${'1'}`">

											<text>资料</text>

										</view>
										<view
											:class="{ 'checkTitlefd2_0_c0': tabs == '2', 'flex flex-wrap align-center heIndex_titlefd2_0_c0_c4': true }"
											@tap="tabs = '2'" :id="`benben_tabsfd2_0_c0-title-item-${'2'}`">

											<text>动态</text>

										</view>
									</view>
									<view
										:style="{ left: tabsInfofd2_0_c0.lineleft, maxWidth: tabsInfofd2_0_c0.lineWidth }"
										id="benben_tabsfd2_0_c0-line"
										class="benben-tabs-line flex benben-flex-tabs-line heIndex_linefd2_0_c0"></view>
								</view>
							</scroll-view>

						</benben-flex-tabs>
						<view>
							<view class="benben_tabsfd2_0_c0-body-item flex flex-wrap align-center" v-if=" tabs == '1' "
								:id="`benben_tabsfd2_0_c0-body-item-${'1'}`">

									<view class='benben-scroll-x'>
										<view class='flex flex-direction align-center benben-scroll flex'>
											<view
												class='flex flex-direction flex-wrap align-stretch heIndex_bodyItemfd2_0_c0_c3_c0_c0'>
												<view
													class='flex flex-wrap align-center justify-between heIndex_bodyItemfd2_0_c0_c3_c0_c0_c0'>
													<text class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c0_c0'>{{details.sex == 2 ? '她的相册' : '他的相册'}}</text>

												</view>
												<view class="heIndex_bodyItemfd2_0_c0_c3_c0_c0_c1_x"
													v-if="details.images.length > 0">
													<view v-for="(v, k) in details.images" :key="k"
														class='flex flex-wrap align-center heIndex_bodyItemfd2_0_c0_c3_c0_c0_c1'>
														<image class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c1_c0'
															mode="aspectFill" @click="previewImage(k, 2)" :src='v'>
														</image>
													</view>
												</view>

												<view
													class='flex flex-direction flex-wrap align-stretch heIndex_bodyItemfd2_0_c0_c3_c0_c0_c2'>
													<view
														class='flex flex-wrap align-center justify-between heIndex_bodyItemfd2_0_c0_c3_c0_c0_c0'>
														<text class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c0_c0'>独白</text>

													</view>
													<view
														class='flex flex-wrap align-center heIndex_bodyItemfd2_0_c0_c3_c0_c0_c2_c1'>
														<text
															class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c2_c1_c0'>{{details.monologue ? details.monologue : '未设置'}}</text>
													</view>
												</view>
												<view class='flex flex-direction flex-wrap align-stretch'>
													<view
														class='flex flex-wrap align-center justify-between heIndex_bodyItemfd2_0_c0_c3_c0_c0_c0'>
														<text class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c0_c0'>评价</text>
													</view>
													<block v-if="details.sex == 2">
														<view
															class='flex flex-wrap align-center justify-between heIndex_bodyItemfd2_0_c0_c3_c0_c0_c0'>
															<view
																class='flex align-center heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0'>
																<text
																	class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c0'>身材</text>
																<view class='flex flex-wrap align-center'>
																	<template v-for="starNum in [1,2,3,4,5]">
																		<image
																			v-if="details.figure_stars >= starNum"
																			:key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c1'
																			mode="aspectFit" :src='STATIC_URL+"59.png"'>
																		</image>
																		<image v-else :key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c1'
																			mode="aspectFit" :src='STATIC_URL+"60.png"'>
																		</image>
																	</template>
																</view>
															</view>
															<view
																class='flex align-center heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1'>
																<text
																	class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c0'>有趣</text>
																<view class='flex flex-wrap align-center'>
																	<template v-for="starNum in [1,2,3,4,5]">
																		<image
																			v-if="details.zest_stars >= starNum"
																			:key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1_c1'
																			mode="aspectFit" :src='STATIC_URL+"59.png"'>
																		</image>
																		<image v-else :key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c1'
																			mode="aspectFit" :src='STATIC_URL+"60.png"'>
																		</image>
																	</template>
																</view>
															</view>
														</view>
														<view
															class='flex flex-wrap align-center justify-between heIndex_bodyItemfd2_0_c0_c3_c0_c0_c2_c1'>
															<view
																class='flex align-center heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0'>
																<text
																	class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c0'>耐心</text>
																<view class='flex flex-wrap align-center'>
																	<template v-for="starNum in [1,2,3,4,5]">
																		<image
																			v-if="details.patience_stars >= starNum"
																			:key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1_c1'
																			mode="aspectFit" :src='STATIC_URL+"59.png"'>
																		</image>
																		<image v-else :key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c1'
																			mode="aspectFit" :src='STATIC_URL+"60.png"'>
																		</image>
																	</template>
																</view>
															</view>
															<view
																class='flex align-center heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1'>
																<text
																	class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c0'>颜值</text>
																<view class='flex flex-wrap align-center'>
																	<template v-for="starNum in [1,2,3,4,5]">
																		<image
																			v-if="details.face_stars >= starNum"
																			:key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1_c1'
																			mode="aspectFit" :src='STATIC_URL+"59.png"'>
																		</image>
																		<image v-else :key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c1'
																			mode="aspectFit" :src='STATIC_URL+"60.png"'>
																		</image>
																	</template>
																</view>
															</view>
														</view>
													</block>
													<block v-else>
														<view
															class='flex flex-wrap align-center justify-between heIndex_bodyItemfd2_0_c0_c3_c0_c0_c2_c1'>
															<view
																class='flex align-center heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0'>
																<text
																	class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c0'>守时</text>
																<view class='flex flex-wrap align-center'>
																	<template v-for="starNum in [1,2,3,4,5]">
																		<image
																			v-if="details.punctuality_stars >= starNum"
																			:key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1_c1'
																			mode="aspectFit" :src='STATIC_URL+"59.png"'>
																		</image>
																		<image v-else :key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c1'
																			mode="aspectFit" :src='STATIC_URL+"60.png"'>
																		</image>
																	</template>
																</view>
															</view>
															<view
																class='flex align-center heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1'>
																<text
																	class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c0'>素质</text>
																<view class='flex flex-wrap align-center'>
																	<template v-for="starNum in [1,2,3,4,5]">
																		<image
																			v-if="details.quality_stars >= starNum"
																			:key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1_c1'
																			mode="aspectFit" :src='STATIC_URL+"59.png"'>
																		</image>
																		<image v-else :key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c1'
																			mode="aspectFit" :src='STATIC_URL+"60.png"'>
																		</image>
																	</template>
																</view>
															</view>
														</view>
														<view
															class='flex flex-wrap align-center justify-between heIndex_bodyItemfd2_0_c0_c3_c0_c0_c2_c1'>
															<view
																class='flex align-center heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0'>
																<text
																	class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c0'>清洁</text>
																<view class='flex flex-wrap align-center'>
																	<template v-for="starNum in [1,2,3,4,5]">
																		<image
																			v-if="details.clean_stars >= starNum"
																			:key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1_c1'
																			mode="aspectFit" :src='STATIC_URL+"59.png"'>
																		</image>
																		<image v-else :key="starNum"
																			class='heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c1'
																			mode="aspectFit" :src='STATIC_URL+"60.png"'>
																		</image>
																	</template>
																</view>
															</view>

														</view>
													</block>
												</view>
											</view>
										</view>
									</view>

							</view>
							<view class="benben_tabsfd2_0_c0-body-item " v-if=" tabs == '2' "
								:id="`benben_tabsfd2_0_c0-body-item-${'2'}`">

									<view class='heIndex_titlefd2_0_c0_c4'>
										<view class='flex flex-wrap align-center heIndex_bodyItemfd2_0_c0_c4_c0_c0'>
											<text class='heIndex_bodyItemfd2_0_c0_c3_c0_c0_c0_c0'>我的发布</text>
										</view>
									</view>

									<view
										class='flex flex-wrap align-center justify-between heIndex_bodyItemfd2_0_c0_c4_c0_c1'>
										<block v-for="(v, k) in list" :key="k">
											<activity :item="v"></activity>
										</block>
                </view>

									<u-loadmore v-if="last_page > 1" class="loadmore" font-size="24" :status="status" :icon-type="iconType" :load-text="loadText" />

									<view class="noData_other" v-if="list.length == 0 && !isShow">
										<image src="/static/empty/no.png"></image>
										<view>没有动态~</view>
									</view>

							</view>

						</view>
					</view>
				</view>
			</view>
			<view class="chat_btn" v-if="tabs == '1' && is_hide == 0" @tap.stop="goChat()">
				私聊
			</view>
		</block>
		
		<u-modal v-model="show" :content="content" :show-cancel-button="true" confirm-color="#6A0002" @confirm="confirm"></u-modal>

	</view>
</template>
<script>
	import UploadImage from '@/common/utils/upload-image.js'
	import activity from '@/components/activity/index.vue'
	export default {
		components: {
			activity
		},


		data() {
			return {
				"tabsInfofd2_0_c0": {
					lineleft: '',
					lineWidth: '',
					moveX: 0,
					scrollX: 0,
					PageScrollX: 0
				},
				"bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c1": "4",
				"bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1_c1": 2,
				"bodyItemfd2_0_c0_c3_c0_c0_c3_c2_c0_c1": 2,
				"bodyItemfd2_0_c0_c3_c0_c0_c3_c2_c1_c1": 2,
				"fd1_0_c0": "",
				"fd1_0_c0id": "",
				"tabs": "1",
				"id": "",
				"details": {
					"images": [],
					"sex": 2
				},

				"list": [],
				"page": 1,
				"is_pull": true,
				"last_page": 1,
				"status": 'loadmore',
				"iconType": 'flower',
				"loadText": {
					loadmore: '轻轻上拉',
					loading: '努力加载中',
					nomore: '我也是有底线的'
				},
				"isShow": true,
				"is_hide": 1,
				"show": false,
				"content": "",
			};
		},
		computed: {
			themeColor() {
				return this.$store.getters.themeColor
			},

		},
		watch: {},
		onLoad(options) {
			let {
				id
			} = options
			if (id !== undefined) this.id = id;
			this.getInformation();
			this.getActivityList();
		},
		onUnload() {

		},
		onReady() {

		},
		onShow() {
			this.postHide();
		},
		onHide() {

		},
		onResize() {

		},
		// 下拉刷新
		onPullDownRefresh() {
			this.page = 1;
			this.is_pull = true;
			this.isShow = true;
			this.getActivityList();
		},
		// 上拉加载
		onReachBottom() {
			if (this.page >= this.last_page) return;
			this.status = 'loading';
			this.page++;
			setTimeout(() => {

				if (this.page >= this.last_page) this.status = 'nomore';
				else this.status = 'loading';
				this.is_pull = false;
				this.getActivityList();
			}, 500)
		},
		onPageScroll(e) {

		},
		methods: {
			// 是否隐藏三方  post64fabe4eafefc
			postHide() {
				this.$api.post(global.apiUrls.post64fabe4eafefc, {
					
				}).then(res => {
					console.log(res);
					if (res.data.code == 1) {
						this.is_hide = res.data.data.is_hide;
					}
				})
			},
			// 用户资料
			getInformation() {
				this.$api.post(global.API_VERSION + '/64366f0e3b620', {
					user_id: this.id
				}).then(res => {
					// console.log(res);

					if (res.data.code == 1) {
						this.details = res.data.data;
					} else {
						this.$message.info(res.data.msg);
					}
				})
			},
			// 用户相亲页动态
			getActivityList() {
				this.$api.post(global.API_VERSION + '/6473222e217cf', {
					user_id: this.id,
					page: this.page
				}).then(res => {
					// console.log(res);
					uni.stopPullDownRefresh();
					this.isShow = false;
					if (res.data.code == 1) {
						this.last_page = res.data.data.last_page;
						if (this.is_pull) {
							this.list = res.data.data.data;
						} else {
							this.list = this.list.concat(res.data.data.data);
						}
					} else {
						this.$message.info(res.data.msg);
					}
				})
			},
			// 关注  647322fb760b6
			getFollow() {
				this.$api.post(global.API_VERSION + '/647322fb760b6', {
					user_id: this.id
				}).then(res => {
					this.$message.info(res.data.msg);
					if (res.data.code == 1) {
						this.getInformation();
					}
				})
			},
			// 拉黑
			openBlock() {
				this.content = '确认拉黑' + this.details.user_nickname + '吗？';
				this.show = true;
			},
			// 拉黑
			confirm() {
				this.$api.post(global.API_VERSION + '/6476ef9c082b2', {
					other_id: this.details.id
				}).then(res => {
					this.$message.info(res.data.msg);
					
				})
			},
			// 图片预览
			previewImage(index, val) {
				let photoList = [];
				if (val == 1) {
					photoList.push(this.details.head_img);
				} else if (val == 2) {
					photoList = this.details.images;
				}
				uni.previewImage({
					current: index,
					urls: photoList
				})
			},
			//上传单图、多图方法
			soloChooseImage(id, path, obj, obj1, fnName = false) {
				let self = this
				if (!obj) obj = this
				if (!obj1) obj1 = this
				if (self.uploading) {
					return
				}
				// 从相册中选择图片
				uni.chooseImage({
					count: 1, // 默认3
					sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
					success: function(res) {
						self.uploading = true
						// 开始上传
						new UploadImage(res.tempFiles, {
							complete: function(res) {
								self.uploading = false
								if (id) self.$set(obj, id, res[0].id)
								if (path) self.$set(obj1, path, res[0].path)
								if (fnName) self[fnName]()
							},
						})
					},
				})
			},
			goChat() {
				// this.$message.info('暂未开启聊天功能');
				uni.navigateTo({
					url: '/pages/home/chat/chat?id=' + this.id
				})
			}
		}
	};
</script>
<style lang="scss" scoped>
	.chat_btn {
		width: 636rpx;
		height: 88rpx;
		border-radius: 44rpx;
		color: #fff;
		background: #6A0002;
		line-height: 88rpx;
		text-align: center;
		margin: 0 auto;
	}
	.page {
		width: 100vw;
		height: 100%;
		overflow-x: hidden;
		height: calc(100vh - var(--window-bottom));
		// background: url(/static/images/18.png) no-repeat, #F8F8F8;
		background-size: 750rpx 720rpx !important;
		background-color: #f8f8f8;
		background-repeat: no-repeat;
		// background-position: center center;
		padding-bottom: 48rpx;
	}

	.heIndex_flex_0 {
		background: rgba(51, 51, 51, 0.7);
		width: 750rpx;
		height: 88rpx;
		overflow: hidden;
		z-index: 10;
		top: 0rpx;
		background-size: 100% auto !important;
	}

	.heIndex_fd0_0_c2_c0 {
		background: #6A0002;
		border-radius: 44rpx 44rpx 44rpx 44rpx;
		font-size: 24rpx;
		color: #fff;
		width: 128rpx;
		height: 56rpx;
		line-height: 56rpx;
	}

	.heIndex_fd0_0_c2 {
		width: 300rpx;
		height: 88rpx;
	}

	.heIndex_fd0_0_c0_c0 {
		width: 32rpx;
		height: 32rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.heIndex_fd0_0_c0 {
		width: 200rpx;
	}

	.heIndex_fd0_0 {
		margin: 0rpx 32rpx 0rpx 32rpx;
	}

	.heIndex_flex_1 {
		background: rgba(51, 51, 51, 0.7);
		height: 591rpx;
		background-size: 100% auto !important;
		// padding-top: 6rpx;
	}

	.heIndex_fd1_3_c0_c0_c1 {
		color: #FFFFFF;
		font-size: 20rpx;
		font-weight: 400;
		line-height: 33rpx;
	}

	.heIndex_fd1_3_c0_c0_c0 {
		color: #FFFFFF;
		font-size: 40rpx;
		font-weight: 700;
		line-height: 57rpx;
		margin: 0rpx 0rpx 6rpx 0rpx;
	}

	.heIndex_fd1_3_c0 {
		margin: 40rpx 0rpx 0rpx 0rpx;
	}

	.heIndex_fd1_3 {
		width: 100%;
	}

	.heIndex_fd1_2_c0 {
		background: rgba(255, 255, 255, 0.3);
		color: #fff;
		font-size: 20rpx;
		font-weight: 400;
		padding: 0 14rpx;
		height: 28rpx;
		line-height: 32rpx;
		background-size: 100% auto !important;
		border-radius: 4rpx 4rpx 4rpx 4rpx;
		margin: 0rpx 8rpx 16rpx 8rpx;
	}

	.heIndex_fd1_2 {
		width: 500rpx;
		// margin: 0rpx 0rpx 60rpx 0rpx;
	}

	.heIndex_fd1_1_c0 {
		color: #FFFFFF;
		font-size: 32rpx;
		font-weight: 500;
		line-height: 29rpx;
	}

	.heIndex_fd1_1 {
		margin: 24rpx 0rpx 16rpx 0rpx;
	}

	.heIndex_fd1_0_c1_c1 {
		color: #6A0002;
		font-size: 20rpx;
		font-weight: 400;
		// margin: 0rpx 0rpx 0rpx auto;
	}

	.heIndex_fd1_0_c1_c0 {
		width: 20rpx;
		height: 20rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		margin: 0rpx 16rpx 0rpx 0rpx;
		vertical-align: middle;
		// transform: translateY(1rpx);
	}

	.heIndex_fd1_0_c1 {
		background: #F4CDCF;
		position: absolute;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		padding: 0rpx 12rpx 0rpx 12rpx;
		bottom: 0rpx;
		width: 150rpx;
		left: -4rpx;
		text-align: center;
		height: 28rpx;
		line-height: 24rpx;
	}

	.heIndex_fd1_0_c0_image {
		width: 140rpx;
		height: 140rpx;
		border-radius: 70rpx 70rpx 70rpx 70rpx;
		margin: 0rpx 0rpx 0rpx 0rpx;
	}

	.heIndex_fd1_0 {
		position: relative;
	}

	.heIndex_flex_2 {
		background: rgba(248, 248, 248, 1);
		margin: -80rpx 0rpx 0rpx 0rpx;
		background-size: 100% auto !important;
		border-radius: 32rpx 32rpx 0rpx 0rpx;
		overflow: hidden;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c1_c3 {
		width: 48rpx;
		height: 48rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		position: absolute;
		right: 16rpx;
		top: 278rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c1_c2_c2 {
		width: 28rpx;
		height: 28rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		margin: 0rpx 0rpx 0rpx auto;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c1_c1 {
		margin: 16rpx 16rpx 24rpx 16rpx;
		color: #FFFFFF;
		font-size: 26rpx;
		font-weight: 500;
		line-height: 37rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c1 {
		background: rgba(65, 65, 75, 1);
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		box-shadow: 0rpx 6rpx 25rpx rgba(0, 0, 0, 0.1);
		margin: 0rpx 0rpx 24rpx 0rpx;
		position: relative;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0_c5 {
		background: #333333;
		position: absolute;
		bottom: 164rpx;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		width: 102rpx;
		height: 32rpx;
		padding: 0rpx 16rpx 0rpx 16rpx;
		right: 16rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0_c4_c1 {
		color: var(--benbenFontColor3);
		font-size: 24rpx;
		font-weight: 400;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0_c4_c0 {
		width: 24rpx;
		height: 24rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0_c4 {
		background: #333333;
		position: absolute;
		bottom: 164rpx;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		width: 102rpx;
		height: 32rpx;
		padding: 0rpx 16rpx 0rpx 16rpx;
		left: 16rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0_c3 {
		width: 48rpx;
		height: 48rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		position: absolute;
		right: 150rpx;
		top: 150rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0_c2_c2 {
		color: #BFBFBF;
		font-size: 20rpx;
		font-weight: 400;
		line-height: 30rpx;
		margin: 0rpx 0rpx 0rpx auto;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0_c2_c1 {
		color: #C4C4C4;
		font-size: 22rpx;
		font-weight: 400;
		line-height: 30rpx;
		margin: 0rpx 0rpx 0rpx 8rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0_c2_c0 {
		width: 40rpx;
		height: 40rpx;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0_c2 {
		margin: 0rpx 16rpx 32rpx 16rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0_c1 {
		margin: 16rpx 16rpx 24rpx 16rpx;
		color: var(--benbenFontColor0);
		font-size: 26rpx;
		font-weight: 500;
		line-height: 37rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0_c0 {
		width: 344rpx;
		height: 342rpx;
		border-radius: 16rpx 16rpx 0rpx 0rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1_c0 {
		background: var(--benbenbgColor0);
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		box-shadow: 0rpx 6rpx 25rpx rgba(0, 0, 0, 0.1);
		margin: 0rpx 0rpx 24rpx 0rpx;
		position: relative;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c1 {
		margin: 0rpx 24rpx 0rpx 24rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c4_c0_c0 {
		margin: 0 32rpx 24rpx 32rpx;
		padding-top: 50rpx;
	}

	.heIndex_titlefd2_0_c0_c4 {
		margin: 0rpx 80rpx 0rpx 0rpx;

	}

	.heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1_c1 {
		width: 28rpx;
		height: 28rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		margin: 0rpx 5rpx 0rpx 5rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c1 {
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		width: 330rpx;
		height: 64rpx;
		padding: 12rpx 0rpx 12rpx 21rpx;
	}

	.heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c1 {
		height: 32rpx;
		margin: 0rpx 5rpx 0rpx 5rpx;
		width: 28rpx;
	}

	.heIndex_star1bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c1 {
		width: 28rpx;
		height: 28rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		margin: 0rpx 5rpx 0rpx 5rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0_c0 {
		color: #666666;
		font-size: 28rpx;
		font-weight: 400;
		margin: 0rpx 16rpx 0rpx 0rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c3_c1_c0 {
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		width: 330rpx;
		height: 64rpx;
		padding: 12rpx 0rpx 12rpx 21rpx;
		margin: 0rpx 26rpx 0rpx 0rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c2_c1_c0 {
		color: #666666;
		font-size: 28rpx;
		font-weight: 400;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c2_c1 {
		margin: 0rpx 32rpx 0rpx 32rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c2 {
		margin: 0rpx 0rpx 64rpx 0rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c1_x {
		padding: 0 8px;
		overflow: hidden;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c1_c0 {
		width: 160rpx;
		height: 160rpx;
		margin: 0rpx 8rpx 24rpx 8rpx;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c1 {
		// margin: 0rpx 0rpx 40rpx 0;
		float: left;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c0_c1 {
		color: #6A0002;
		font-size: 28rpx;
		font-weight: 400;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c0_c0 {
		color: #333333;
		font-size: 32rpx;
		font-weight: 500;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0_c0 {
		margin: 0rpx 32rpx 24rpx 32rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0_c0 {
		margin: 50rpx 0rpx 0rpx 0rpx;
	}

	.heIndex_bodyItemfd2_0_c0_c3_c0 {
		touch-action: none;
		height: 780rpx;
	}

	.heIndex_titlefd2_0_c0_c3 {
		margin: 0rpx 0rpx 0rpx 80rpx;
	}

	.heIndex_linefd2_0_c0 {
		// background: rgba(106, 0, 2, 1);
		background: url(/static/images/20.png) no-repeat;
		width: 24rpx;
		height: 20rpx;
		top: 78rpx;
		background-size: 100% auto !important;
	}

	.checkTitlefd2_0_c0 {
		font-weight: 500 !important;
		font-size: 32rpx !important;
		color: rgba(51, 51, 51, 1) !important;
	}

	::v-deep .heIndex_benbenTabsfd2_0_c0 {
		background: rgba(248, 248, 248, 1);
		height: 90rpx;
		white-space: nowrap;
		text-align: center;
		font-style: normal;
		color: rgba(153, 153, 153, 1);
		font-size: 28rpx;
		font-weight: 400;
	}

	.heIndex_flex_3 {
		padding: 88rpx 0rpx 0rpx 0rpx;
		width: 50vw;
	}

	.heIndex_fd3_0_c0_c0 {
		color: #333333;
		font-size: 28rpx;
		font-weight: 500;
	}

	.heIndex_fd3_0_c0 {
		padding: 28rpx 0rpx 28rpx 0rpx;
	}

	.heIndex_fd3_0 {
		padding: 0rpx 24rpx 0rpx 24rpx;
	}
	.benben_tabsfd2_0_c0-body-item {
		background: #fff;
		padding-bottom: 32rpx;
	}
</style>
